{% block action %}
    <div class="modal" id="{{ 'action--'~cls.key }}" tabindex="-1" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered modal-xl">
            <div class="modal-content">
                <div class="modal-header">

                    <div class="bx-pull-right">
                        <button class="btn-close" onclick="hideModals()" aria-label="Close"></button>
                    </div>
                </div>
                <form class="was-validated"
                      hx-post="/base/action"
                      hx-ext="json-enc"
                      hx-include="this"
                      hx-target="#trash"
                      hx-vals='{
                "model": "{{ cls.model.name }}",
                "action": "{{ action }}",
                "key": "{{ cls.key }}",
                "method": "update",
                "commit": "true"
              }'
                >
                    <div class="modal-body text-center p-5">
                        <lord-icon
                                src="https://cdn.lordicon.com/ghhwiltn.json"
                                trigger="loop"
                                style="width:150px;height:150px">
                        </lord-icon>
                        <div class="card">
                            <h3 class="card-header" data-key="t-{{ action }}"> {{ action }} </h3>
                            <div class="card-body">
                            {% for line in cls.action_lines.lines %}
                                <div class="row">
                                    {% for field_name, field in line.fields %}
                                        {% if loop.length % 3 != 0 and loop.first %}
                                            <div class="row">
                                        {% endif %}
                                        {% if loop.index0 % 3 == 0 %}
                                            <div class="row">
                                        {% endif %}
                                    <div class="col" {% if field.field_name in ('id', 'ids', 'lsn', 'vars') %} style="display: none" {% endif %}>
                                        {{ field.label|safe }}
                                        {{ field.as_form|safe }}
                                    </div>
                                    {% if loop.index % 3 == 0 %}
                                        </div>
                                    {% endif %}
                                    {% endfor %}
                                    </div>
                                {% endfor %}
                                    <div class="modal-footer">
                                        <button type="button" class="btn btn-secondary" onclick="hideModals()" >Close
                                        </button>
                                        <button id="{{ 'submit'~cls.key }}" type="submit" class="btn btn-success">
                                            Save
                                        </button>

                                    </div>
                                </div>
                            </div>
                </form>
            </div>
        </div>
    </div>
    <script>
        var modal = new bootstrap.Modal('#{{ 'action--'~cls.key }}')
        modal.show()
    </script>
{% endblock %}
